Programming online experiments with jsPsych

This tutorial is an introduction to jsPsych, which is a free and open-source software package for creating experiments that run in a web browser. Participants in the tutorial will learn how to build an experiment using jsPsych, and how to extend and customize jsPsych for novel experimental paradigms. Running experiments online is a popular method among cognitive scientists. Data collection is (extremely) fast and cheap, and the quality of the data is generally quite high (Buhrmester, Kwang, & Gosling, 2011; Crump, McDonnell, & Gureckis, 2013; Simcox & Fiez, 2014; Zwaan & Pecher, 2012). There are methodological benefits as well, such as a more diverse subject pool (Arnett, 2008; Ross, Irani, Silberman, Zaldivar, & Tomlinson, 2010) and a reduction in possible experimenter-induced biases. Building an experiment that can be run online requires proficiency in web development techniques that many researchers lack. As a result, there is a demand for tools that make online experiments easier to develop and run. A few such tools are now available and used within the cognitive science community, including PsiTurk (McDonnell et al., 2012), QRTEngine (Barnhoorn, Haasnoot, Bocanegra, & van Steenbergen, 2014), and jsPsych (de Leeuw, 2014). The main benefit of using jsPsych is that it reduces the complexity of programming experiments for the web. Researchers using jsPsych will still need to know how to program (in JavaScript), but the programming tasks will map more naturally on to the design (rather than the implementation) of the experiment. For example, it’s not necessary to write code that will determine what key was pressed and what the response time is. jsPsych handles this, and other functionality that is common across most experiments, such as figuring out which task/trial to run next, controlling the flow of the participant through the study, storing data, and so on. However, it is necessary to describe, in code, the design of the experiment, including what kinds of tasks the subject will complete, what stimuli they will see, how long displays will last, and so on. Experiments in jsPsych are composed of individual tasks, such as showing the subject instructions, displaying a stimulus and getting a response, or filling out a survey question. These tasks are assembled, by the researcher, into a timeline. A timeline describes the tasks, the parameters for the tasks, and what order the tasks will occur. A main design feature of jsPsych is that each task is defined in its own code file, known as a plugin. Plugins have a standardized, yet extremely flexible, structure. This makes it possible to create custom plugins for tasks that are not possible with the set of plugins included in jsPsych. It is also easy to share plugins, to make replications and further manipulations of a particular task relatively easy to implement for other researchers. Information about jsPsych was presented at the 2014 Cognitive Science Society meeting as part of a larger tutorial about creating online experiments (de Leeuw et al., 2014). This tutorial will go into significantly more depth, covering more features of the library, how to develop new tasks/plugins, and demonstrating a set of new features that were added in a major update in October 2014. This update made it possible to implement a variety of different experimental designs that were previously impossible with jsPsych, including conditional branching and looping structures. Other new features from the update include the ability to easily randomize trial order, repeat sets of trials, and automatically display a progress bar. For a complete list of features, see the online documentation at http://docs.jspsych.org. The tutorial is targeted at researchers who have some familiarity and comfort with programming and an interest in developing experiments for the web. Researchers who have no programming background may find it difficult to follow along, as the basics of programming won’t be covered. The tutorial should be of interest to researchers with all levels of web-development expertise. Those who are less familiar with web-development techniques will find it easier to learn to use jsPsych than learning to create experiments from scratch, while researchers with a web-development background may find that jsPsych offers a streamlined way of building experiments that is more efficient than programming experiments on a case-by-case basis. Participants are strongly encouraged to bring a laptop with a programming-friendly text editor, such as Atom (http://www.atom.io), to follow along, but may also find it informative to just observe and learn about what is possible with jsPsych.